*{
    padding:0;
    margin:0;
    text-decoration: none;
}
html{
    font-size:32vw;
}
body{
    font-size:0.07rem;
}
html,body,.box{
    height:100%;
}
header{
    height:0.42rem;
    display:flex;
    justify-content: space-between;
    align-items: center;
    background-color: #1d6dff;
    padding:0 0.08rem;
}
header #left img{
    width:1.04rem;
    height:0.22rem;
}
header #right img{
    width:0.28rem;
    height:0.28rem;
}
nav{
    height:0.42rem;
    display:flex;
    justify-content: center;
    align-items: center;
    border-bottom:0.01rem solid #ccc;
}
nav input{
    width:2.95rem;
    height:0.25rem;
    position: relative;
    border-radius: 0.17rem;
    
}
::-webkit-input-placeholder{
    padding-left:0.10rem;
}
nav p{
    position: absolute;
    background-color:  #1d6dff;
    height:0.25rem;
    width:0.53rem;
    border-radius: 0.17rem;
    text-align: center;
    line-height: 0.25rem;
    right:0.09rem;
    font-size: 0.13rem;
    color:white;
}
main{
    /* width:100%; */
    /* height:2.6rem; */
    display: flex;
    flex-wrap: wrap;
}
main>div{
    height:33%;
    width:25%;
    /* flex:1; */
    display:flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}
main>div img{
    width:0.42rem;
    height:0.42rem;
}
section{
    height:0.29rem;
    display:flex;
    justify-content: space-between;
    align-items: center;
    padding:0 0.08rem;
    background-color:  #1d6dff;
    font-size:0.17rem;
    color:white;
}
section a{
    display:flex;
    align-items: center;
}

section img{
    height:0.17rem;
    width:0.17rem;
}
#box a{
    display:flex ;
    justify-content: space-between;
    align-items: center;
    height:1.12rem;
    width:100%;
    padding:0 0.08rem;
}
#box a img{
    height:0.83rem;
    width:0.75rem;
}
#box a .right{
    width:2.19rem;
    height:0.71rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}
#box a .right .top{
    font-size: 0.13rem;
    color:black;
}
#box a .right .top span{
    color:red;
}

#box a .right .bottom{
    font-size: 0.12rem;
    color:#999;
    display:flex;
    justify-content: space-between;
}
.bottom .icon-xiaoxi{
    font-size: 0.13rem!important;
   
}
footer{
    background-color: #f4f4f4;
    height:1.87rem;
    /* width:100%; */
    padding-top: 0.08rem;
    box-sizing: border-box;
    
    
}
footer .top{
    height:0.27rem;
    width:2.96rem;
    text-align: center;
    line-height:0.27rem;
    border:1px solid #999;
    border-radius: 0.04rem;
    font-size: 0.12rem;
    margin:0 auto;
    margin-bottom:0.13rem;
}
footer .center{
    /* width:100%; */
    height:0.29rem;
    display:flex;
    justify-content: space-between;
    align-items: center;
    padding:0 0.08rem;
    background-color:  #1d6dff;
    font-size:0.17rem;
    color:white;
    margin-bottom:0.13rem;
}
footer .center a{
    display:flex;
    align-items: center;
}

footer .center img{
    height:0.17rem;
    width:0.17rem;
}
footer .bottom{
    height:0.93rem;
    font-size: 0.13rem;
}
footer .bottom .one{
    height:0.29rem;
    width:100%;
    display: flex;

}
footer .bottom .one p{
    flex:1;
    height:100%;
    text-align: center;
    line-height:0.29rem ;
    border:1px solid #ccc;
}
footer .bottom .two{
    height:calc(100% - 0.29rem);
    display:flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
